<template>
  <el-dialog v-model='state.show' title='测试表编辑' draggable width='800px'>
    <el-form ref='formRef' :model='form' class='zform' :inline="true" label-width='120px'>
      <div class="zform-div">


        <el-form-item label='名称：' prop='name'>
          <el-input v-model='form.name'/>
        </el-form-item>

        <el-form-item label='年龄：' prop='age'>
          <el-input-number v-model='form.age' controls-position='right' style='width: 100%'/>
        </el-form-item>






        <el-form-item label='创建人：'>
          <div class="zinput">{{ form.createBy ||'' }}</div>
        </el-form-item>
        <el-form-item label='创建时间：'>
          <div class="zinput">{{ form.createTime }}</div>
        </el-form-item>
        <el-form-item label='更新人：'>
          <div class="zinput">{{ form.updateBy || '' }}</div>
        </el-form-item>
        <el-form-item label='更新时间：'>
          <div class="zinput">{{ form.updateTime }}</div>
        </el-form-item>
      </div>
    </el-form>
    <template #footer>
      <span class='dialog-footer'>
				<el-button type='primary' @click='handleConfirm'>确 认</el-button>
        <el-button @click='state.show = false'>取 消</el-button>
      </span>
    </template>
  </el-dialog>
</template>

<script lang='ts' setup>
import {defineExpose, reactive, ref, toRefs} from 'vue';
import {modalSave} from '/@/comps/page/edit';
import request from "/@/utils/request";

const state = reactive({
  url: '/ceshi', show: false,
  form: {} as any,
});

const {form} = toRefs(state);

const formRef = ref();
const open = async (data: any) => {
  if (data && data.id) {
    state.form = await request({
      url: state.url + '/one/' + data.id,
      method: 'get',
    });
  } else {
    state.form = {};
    if (formRef.value) {
      formRef.value.resetFields();
    }
  }
  state.show = true;
};
defineExpose({open});

const emits = defineEmits(['close']);
const handleConfirm = async () => {
  await modalSave({formRef: formRef.value, state, iouField: "id"});
  emits('close');
};
</script>

